import React from 'react';
import Menu from '@/components/Common/Menu'
import '@/assets/css/user.css'

const Index = () =>
{
    let [order, SetOrder] = React.useState({
        zf: 0,
        pj: 0,
        tk: 0,
    })

    // 退出
    const logout = async () =>
    {
        var result = await React.UI.Dialog.confirm({
            content: '是否确认退出'
        })

        if(result)
        {
            // 删除cookie
            React.Cookie.remove('business')

            //跳转
            React.navigate('/business/login')
        }
    }

    React.useEffect(() => {
        OrderData()
    }, [])

    //请求详情
    const OrderData = async () =>
    {
        var data = {
            busid: React.Business.id,
        }

        var result = await React.HTTP.post("/business/info", data)

        if(result.code == 0)
        {
            React.error(result.msg)
            return false
        }

        SetOrder(result.data)
    }
    // console.log(order)

    return (
        <>      
            <div className="top">
                <div>个人中心</div>
            </div>

            {/* 头部 */}
            <div className="header">
                <div className="userinfo">
                    <div className="avatar">
                        <img src={React.Business.avatar_text} alt="" />
                    </div>
                    <div className="nickname">{React.Business.nickname ? React.Business.nickname : '匿名'}</div>
                    <div className="nickname">{React.Business.introduce ? React.Business.introduce : '这家伙很懒,什么也没有写!'}</div>
                </div>
                <div className="corrugated">
                    <div className="wave-top wave-item"></div>
                    <div className="wave-middle wave-item"></div>
                    <div className="wave-bottom wave-item"></div>
                </div>
            </div>

            <div className="menu-center">
                <div className="item">
                    <React.Router.Link to="/order/index">
                        <div>{order.zf}</div>
                        <div className="text">已支付</div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/order/index">
                        <div>{order.pj}</div>
                        <div className="text">已评论</div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/order/index">
                        <div>{order.tk}</div>
                        <div className="text">已退款</div>
                    </React.Router.Link>
                </div>
            </div>
            
            <div className="menu-cell">
            <div className="item">
                    <React.Router.Link to="/business/pro">
                        <div className="title">测试</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/business/profile">
                        <div className="title">个人资料</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/guest/index">
                        <div className="title">住客信息</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/order/index">
                        <div className="title">房间订单</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/business/collcet">
                        <div className="title">我的收藏</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/business/coupons">
                        <div className="title">我的优惠券</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <React.Router.Link to="/coupon/hotinfo">
                        <div className="title">关于我们</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </React.Router.Link>
                </div>
                <div className="item">
                    <a onClick={logout}>
                        <div className="title">退出登陆</div>
                        <div className="icon">
                            <img src="/assets/images/right.png" alt="" />
                        </div>
                    </a>
                </div>
            </div>
            
            
            <Menu />
        </>
    )
}

export default Index